/*首页*/
.header {
    height: 135px;
    background: url("../images/index_red/head.png") no-repeat center center;
    background-size: cover;
}
.liulan{
    float: right;
    height: 121px;
    line-height: 121px;
    color: #FFF;
    margin: 0 30px;
}
.liulan i{
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(../images/index_red/yj.png) no-repeat center center;
    background-size: cover;
}
.lang{
    height: 121px;
    line-height: 175px;
    float: right;
}

.cont{
    width: 100%;
    height: 500px;
    background: url(../images/index_red/conbg.png) no-repeat center center;
    background-size: cover;
}

.proCon{
    width: 1195px;
    height: 330px;
    margin: 0 auto;
    padding: 100px 0 70px 0;
}
.jsuo{
    width: 100%;
    padding: 0 120px;
    box-sizing: border-box;
    height: 56px;
    line-height: 56px;
}

.jsuo .lef{
    width: 60%;
    float: left;
    height: 30px;
    line-height: 30px;
}
.jsuo .lef input{
    width: 100%;
    height: 50px;
    line-height: 50px;
    border: 2px solid red;
    outline: none;
}

.jsuo .rig{
    width: 15%;
    float: left;
    height: 30px;
    line-height: 30px;
}
.jsuo .cen{
    float: right;
}

.jsuo .cen .wx{
    width: 53px;
    height: 54px;
    background: url(../images/index_red/wx.png) no-repeat center center;
    background-size: cover;
    float: left;
    margin-right: 10px;
    position: relative;
}
.jsuo .cen .wx span{
    color: #333;
    position: absolute;
    top: 20px;
    left: 5px;
    cursor: pointer;
}
.jsuo .cen .wx span:hover{
    color: cornflowerblue;
}
.jsuo .cen .app span{
    color: #333;
    position: absolute;
    top: 20px;
    left: 5px;
    cursor: pointer;
}
.jsuo .cen .app span:hover{
    color: cornflowerblue;
}
.jsuo .cen{
    width: 20%;
    float: right;
    margin-right: 20px;

}
.jsuo .cen .app{
    width: 41px;
    height: 54px;
    background: url(../images/index_red/app.png) no-repeat center center;
    background-size: cover;
    float: left;
    position: relative;
}

.pronav{
    width: 100%;
    height: 220px;
    margin-top: 50px;
}
.pronav ul li{
    text-align: center;
    width: 123px;
    height: 220px;
    margin-right: 9px;
    float: left;
    padding: 12px 5px;
    box-sizing: border-box;
}
.pronav ul li:hover{
    margin-top: -10px;
    cursor: pointer;
}
.pronav ul li span{
    display: inline-block;
    width: 102px;
    height: 101px;
    margin: 0 auto;
}

.pronav ul li .mesg .tit{
    height: 20px;
    line-height: 20px;
    color: #FFF;
    font-size: 16px;
    text-align: center;
    margin: 5px 0;
}
.pronav ul li .mesg .xinxi{
    color: #e2dfdf;
    font-size: 14px;
    line-height: 21px;
    text-align: center;
}

.pronav ul li:first-child{
    background: #5d7bd1;
}

.pronav ul li:nth-child(2){
    background: #3a73c7;
}
.pronav ul li:nth-child(3){
    background: #319bbd;
}
.pronav ul li:nth-child(4){
    background: #209d83;
}
.pronav ul li:nth-child(5){
    background: #438e54;
}
.pronav ul li:nth-child(6){
    background: #d3ae18;
}
.pronav ul li:nth-child(7){
    background: #733f90;
}
.pronav ul li:nth-child(8){
    background: #b73a7b;
}
.pronav ul li:nth-child(9){
    background: #b71a1a;
}

.pronav ul li:first-child span{
    background: url(../images/index_red/nav1.png) no-repeat center center;
    background-size: 100% 100%;
}
.pronav ul li:nth-child(2) span{
    background: url(../images/index_red/nav2.png) no-repeat center center;
    background-size: 100% 100%;
}
.pronav ul li:nth-child(3) span{
    background: url(../images/index_red/nav3.png) no-repeat center center;
    background-size: 100% 100%;
}
.pronav ul li:nth-child(4) span{
    background: url(../images/index_red/nav4.png) no-repeat center center;
    background-size: 100% 100%;
}
.pronav ul li:nth-child(5) span{
    background: url(../images/index_red/nav5.png) no-repeat center center;
    background-size: 100% 100%;
}
.pronav ul li:nth-child(6) span{
    background: url(../images/index_red/nav6.png) no-repeat center center;
    background-size: 100% 100%;
}
.pronav ul li:nth-child(7) span{
    background: url(../images/index_red/nav7.png) no-repeat center center;
    background-size: 100% 100%;
}
.pronav ul li:nth-child(8) span{
    background: url(../images/index_red/nav8.png) no-repeat center center;
    background-size: 100% 100%;
}
.pronav ul li:nth-child(9) span{
    background: url(../images/index_red/nav9.png) no-repeat center center;
    background-size: 100% 100%;
}

/*标签*/
.bqian{
    margin: 30px 0;
    height: 203px;
}
.bqian ul li{
    width: 291px;
    height: 98px;
    margin-right: 8px;
    margin-bottom: 8px;
    float: left;
    cursor: pointer;
}
.bqian ul li:hover{
    margin-top: -5px;
}
.bqian ul li span{
    width: 58%;
    display: inline-block;
    margin-left: 115px;
    height: 98px;
    line-height: 25px;
    font-size: 16px;
    color: #d01515;
    font-weight: bold;
    padding-top: 25px;
    box-sizing: border-box;
}
.bqian ul li:first-child{
    background: url(../images/index_red/bg_newA.png) no-repeat center center;
    background-size: 100% 100%;
    width: calc((100% - 24px)/3);
}
.bqian ul li:nth-child(2){
    background: url(../images/index_red/bg_newB.png) no-repeat center center;
    background-size: 100% 100%;
    width: calc((100% - 24px)/3);
}
.bqian ul li:nth-child(3){
    background: url(../images/index_red/bg_newC.png) no-repeat center center;
    background-size: 100% 100%;
    width: calc((100% - 24px)/3);
}
/*.bqian ul li:nth-child(4){*/
    /*background: url(../images/index_red/b4.png) no-repeat center center;*/
    /*background-size: 100% 100%;*/
    /*margin-right: 0;*/
/*}*/
.bqian ul li:nth-child(4){
    background: url(../images/index_red/b5.png) no-repeat center center;
    background-size: 100% 100%;
    clear: both;
}
.bqian ul li:nth-child(5){
    background: url(../images/index_red/b6.png) no-repeat center center;
    background-size: 100% 100%;
}
.bqian ul li:nth-child(6){
    background: url(../images/index_red/b7.png) no-repeat center center;
    background-size: 100% 100%;
}
.bqian ul li:nth-child(7){
    background: url(../images/index_red/b8.png) no-repeat center center;
    background-size: 100% 100%;
    margin-right: 0;
}


.qk{
    width: 100%;
    height: 128px;
    margin: 28px 0;
}
.qk ul li{
    cursor: pointer;
    width: 392px;
    height: 128px;
    float: left;
    margin-right:6px;
}
.qk ul li:hover{
    margin-top: -5px;
    box-shadow: 1px 1px 2px #eee;
}
.qk ul li:first-child{
    background: url(../images/index_red/q1.png) no-repeat center center;
    background-size: 100% 100%;
}

.qk ul li:nth-child(2){
    background: url(../images/index_red/q2.png) no-repeat center center;
    background-size: 100% 100%;
}
.qk ul li:nth-child(3){
    background: url(../images/index_red/q3.png) no-repeat center center;
    background-size: 100% 100%;
}

.qk ul li span{
    width: 60%;
    display: inline-block;
    margin-left: 136px;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
    color: #FFF;
    font-weight: bold;
    padding-top: 15px;
    box-sizing: border-box;
}
.qk ul li i{
    font-style: normal;
    color: #FFF;
    font-size: 13px;
    margin-left: 136px;
}
.server{
    width: 100%;
    margin: 28px 0;
    height: 350px;
}
.server .serTab{
    height: 36px;
    width: 100%;
    position: relative;
}
.server .serTab .title{
    position: relative;
}
.server .serTab .title ul li{
    width: 140px;
    height: 36px;
    line-height: 36px;
    float: left;
    text-align: left;
    cursor: pointer;
}
.server .serTab .title ul li:first-child i {
    display: inline-block;
    width: 24px;
    height: 20px;
    background: url(../images/index_red/tz.png) no-repeat center center;
    background-size: 100% 100%;
    margin-right: 5px;
    float: left;
    margin-top: 8px;
}
.server .serTab .title ul li:last-child i {
    display: inline-block;
    width: 24px;
    height: 20px;
    background: url(../images/index_red/tz2.png) no-repeat center center;
    background-size: 100% 100%;
    margin-right: 5px;
    float: left;
    margin-top: 8px;
}
.server .serTab .title ul li .shu{
    color: #ddd;
    margin-left: 15px;
}
.server .serTab .title ul .active{
    color: #d01515;
    border-bottom: 2px solid #d01515;
}


.server .serTab .title .more {
    font-size: 16px;
    color: #999;
    position: absolute;
    top: 5px;
    right: 0;
    cursor: pointer;
    font-weight: bold;
}
.server .serTab .title .line{
    width: 73%;
    border-bottom: 1px solid #ccc;
    position: absolute;
    left: 256px;
    top: 18px;
}
.server .serTab .title .more i {
    display: inline-block;
    width: 16px;
    height: 15px;
    background: url(../images/index_red/more.png) no-repeat center center;
    background-size: 100% 100%;
    margin-left: 5px;
    float: right;
    margin-top: 5px;
}

.sermesg{
    width: 100%;
    margin: 15px 0;
}
.sermesg .lef{
    float: left;
    width: 32%;
    margin-right: 1%;
}

.sermesg .lef ul li{
    cursor: pointer;
    height: 60px;
    color: #333;
    border-bottom: 1px solid #d9d9d9;
    width: 330px;
    line-height: 30px;
}
.sermesg .lef ul li:hover{
    background: #f6f8fb;
}
.sermesg .lef ul li i{
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50px;
    background: #999;
    margin-right: 15px;
}
.sermesg .lef ul li span{
    font-size: 14px;
}
.sermesg .lef ul li .sj{
    color: #333;
    float: right;
    display: inline-block;
}
.sermesg .cent{
    float: left;
    width: 32%;
    margin-right: 1%;
}
.sermesg .cent ul li{
    cursor: pointer;
    height: 60px;
    color: #333;
    border-bottom: 1px solid #d9d9d9;
    width: 330px;
    line-height: 30px;
}
.sermesg .cent ul li:hover{
    background: #f6f8fb;
}
.sermesg .cent ul li i{
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50px;
    background: #999;
    margin-right: 15px;
}
.sermesg .cent ul li span{
    font-size: 14px;
}
.sermesg .cent ul li .sj{
    color: #333;
    float: right;
    display: inline-block;
}
.sermesg .rig{
    float: right;
    width: 32%;
    margin-right: 1%;
}
.sermesg .rig ul li{
    cursor: pointer;
    height: 60px;
    color: #333;
    border-bottom: 1px solid #d9d9d9;
    width: 330px;
    line-height: 30px;
}
.sermesg .rig ul li:hover{
    background: #f6f8fb;
}
.sermesg .rig ul li i{
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50px;
    background: #999;
    margin-right: 15px;
}
.sermesg .rig ul li span{
    font-size: 14px;
}
.sermesg .rig ul li .sj{
    color: #333;
    float: right;
    display: inline-block;
}

.ts{
    width: 100%;
    height: 128px;
    margin: 28px 0;
}
.ts ul li{
    cursor: pointer;
    width: 291px;
    height: 110px;
    float: left;
    margin-right:6px;
}
.ts ul li:hover{
    margin-top: -5px;
    box-shadow: 1px 1px 2px #ccc;
}
.ts ul li:first-child{
    background: url(../images/index_red/ts1_small.png) no-repeat center center;
    background-size: 100% 100%;
}

.ts ul li:nth-child(2){
    background: url(../images/index_red/ts2_small.png) no-repeat center center;
    background-size: 100% 100%;
}
.ts ul li:nth-child(3){
    background: url(../images/index_red/ts3_small.png) no-repeat center center;
    background-size: 100% 100%;
}
.ts ul li:nth-child(4){
    background: url(../images/index_red/ts4_small.png) no-repeat center center;
    background-size: 100% 100%;
}

.ts ul li span{
    width: 60%;
    display: inline-block;
    margin-left: 122px;
    height: 60px;
    line-height: 30px;
    font-size: 18px;
    color: #FFF;
    font-weight: bold;
    padding-top: 35px;
    box-sizing: border-box;
}
.ts ul li i{
    font-style: normal;
    color: #FFF;
    font-size: 13px;
    margin-left: 136px;
}
.ts ul li option{
    font-style: normal;
    color: #FFF;
    font-size: 13px;
    margin-left: 136px;
}


.serStart{
    width: 100%;
    height: 400px;
    margin-bottom: 28px;
    background: #f5f8fb;
}
.serStart .title{
    color: #000;
    font-size: 18px;
    font-weight: bold;
    height: 63px;
    line-height: 63px;
    text-align: center;
    position: relative;
}
.serStart .title span{
    font-size: 16px;
    color: #999;
    position: absolute;
    right: 0;
    top: 12%;
    cursor: pointer;
}
.serStart .title span i{
    display: inline-block;
    width: 16px;
    height: 15px;
    background: url(../images/index_red/more.png) no-repeat center center;
    background-size: 100% 100%;
    margin-left: 5px;
}
.mx{
    width: 100%;
    height: 61px;
    background: url(../images/index_red/mx.png) no-repeat center center;
    background-size: 100% 100%;
}

.serStart article{
    width: 94%;
    padding: 15px 35px;
    font-size: 14px;
    color: #999;
    line-height: 30px;
    text-indent: 2em;
}

.mxr{
    width: 100%;
    height: 136px;
}
.mxr ul li{
    cursor: pointer;
    width: 220px;
    height: 136px;
    float: left;
    border: 1px solid #ddd;
    margin-right: 8px;
    position: relative;
}
.mxr ul li img{
    float: left;
    margin-right: 12px;
}
.mxr ul li img:hover{

}
.mxr ul li .msg{

    padding: 8px;
    box-sizing: border-box;
}
.mxr ul li .msg .tit{
    margin: 8px 0;
}


.xban{
    cursor: pointer;
    width: 100%;
    height: 111px;
    margin: 25px 0;
}

.map{
    width: 100%;
    height: 541px;
    padding: 15px;
    box-sizing: border-box;
}
.map .mapt{
    float: left;
}
.map .sheng{
    padding: 15px;
    box-sizing: border-box;
    float: right;
}
.map .sheng ul{
    width: 457px;
}
.map .sheng ul li{
    width: 66px;
    height: 30px;
    line-height: 30px;
    float: left;
    margin: 10px;
    text-align: center;
    cursor: pointer;
}
.map .sheng ul li:hover{
    background: #1f63c8;
    border-radius: 5px;
    color: #FFF;
}

.login a {
    height: 121px;
    line-height: 121px;
    color: #e3e8f3;
    font-size: 16px;
    margin-left: 9px;
    border: 1px solid #fff;
    border-radius: 6px;
    padding: 3px 12px;
}
.login a:hover{
    background: #af100f;
    text-decoration: none;
}


.videoCover {
    position: absolute;
    top: 0;
    right: 122px;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,0.2);
    z-index: 2;
}

.videoCover_scan {
    height: 7.87rem;
    background: url(../images/index_red/scanning_page.png) no-repeat center/100% 100%;
    position: relative;
}

.scanning_line {
    position: absolute;
    top: 1.45rem;
    right: 0.74rem;
    left: 0.74rem;
    height: 0.04rem;
    /* height: 5.16rem; */
    background: url(../images/index_red/scanning_line.png) no-repeat center/100% 100%;
    animation: scanningLine 5s infinite;
    -webkit-animation: scanningLine 5s infinite;
}

.noticeInfo {
    width: 4rem;
    height: 0.6rem;
    line-height: 0.65rem;
    text-align: center;
    font-size: 0.26rem;
    color: #fff;
    transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    -moz-transform: translate(-50%,0);
    -ms-transform: translate(-50%,0);
    -o-transform: translate(-50%,0);
    position: absolute;
    left: 50%;
    bottom: 0;
}

.videoCover_other {
    position: absolute;
    top: 7.87rem;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0,0,0,0.45);
}


.videoCover{
    position: absolute;
    top: 0;
    right: 122px;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,0.2);
    z-index: 2;
}
#video{
    display: block;
}
.videoCover_scan{
    height: 7.87rem;
    background: url('../images/index_red/scanning_page.png') no-repeat center/100% 100%;
    position: relative;
}
.videoCover_other{
    position: absolute;
    top: 7.87rem;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0,0,0,0.45)
}
.scanning_line{
    position: absolute;
    top: 1.45rem;
    right: 0.74rem;
    left: 0.74rem;
    height: 0.04rem;
    /*height: 5.16rem;
    */background: url('../images/index_red/scanning_line.png') no-repeat center/100% 100%;
    animation: scanningLine 5s infinite;
    -webkit-animation: scanningLine 5s infinite;
}

@keyframes scanningLine{
    0%{
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
    }
    50%{
        transform: translateY(5.16rem);
        -webkit-transform: translateY(5.16rem);
        -moz-transform: translateY(5.16rem);
        -ms-transform: translateY(5.16rem);
        -o-transform: translateY(5.16rem);
    }
    100%{
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
    }
}

.noticeInfo{
    width: 4rem;
    height: 0.6rem;
    line-height: 0.65rem;
    text-align: center;
    font-size: 0.26rem;
    color: #fff;
    transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    -moz-transform: translate(-50%,0);
    -ms-transform: translate(-50%,0);
    -o-transform: translate(-50%,0);
    position: absolute;
    left: 50%;
    bottom: 4px;
}


.logo {
    width: 388px;
    height: 121px;
    background: url(../images/index_red/logo.png) no-repeat left center;
}